<script setup lang="ts">
import FormDiv from "./component/FormDiv.vue"
</script>

<template>
  <a-flex justify="center" align="center" class="form-layout app-bg">
    <a-flex class="content-rgs">
      <div class="image-div"></div>
      <div class="form-div">
        <form-div/>
      </div>
    </a-flex>
  </a-flex>
</template>

<style lang="scss" scoped>
.form-layout{
  width: 100%;
  height: 100vh;
  box-shadow: 2px 2px 20px inset rgba(215,254,253,.72);
}
.content-rgs{
  width:60rem;
  height: 27rem;
  border-radius: 3px;
  box-shadow: 2px 2px 2px 2px $blue-1;
  background: transparent;
  position: relative;
  border: .5px solid $blue-1;
}
.image-div{
  margin: 0;
  width: 45%;
  height: 100%;
  background: #fff url("./image/registerBg.png");
  background-size: 100% 100%;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}
.form-div{
  margin: 0;
  width: 52%;
  height: 100%;
  background: transparent;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}
</style>